<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="description" content="a low-code development platform for creating systems" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
  <title>System Designer</title>
  <!-- bootstrap -->
  <link href="lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
  <!-- prism -->
  <link href="lib/prism/prism.css" rel="stylesheet" />
  <!-- designer styles -->
  <link href="styles/designer.css" rel="stylesheet" />
</head>

<body id="body">
  <!-- menubar -->
  <nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
      <!-- menu header -->
      <div id="designer-menubar-header" class="navbar-header"></div>
      <div>
        <!-- menu items -->
        <ul id="designer-menubar-items" class="nav navbar-nav"></ul>
        <!-- menu actions -->
        <ul id="designer-menubar-actions" class="nav navbar-nav navbar-right hidden-xs"></ul>
      </div>
    </div>
  </nav>
  <div class="container">
    <div class="row">
      <!-- toolbar -->
      <div class="col-xs-1 col-sm-1 sidebar">
        <!-- toolbar items -->
        <ul id="designer-toolbar-items" class="nav nav-sidebar"></ul>
      </div>
      <div class="col-xs-offset-1 col-sm-offset-1 col-xs-8 col-sm-9 main">
        <!-- dialogs -->
        <div id="designer-dialog"></div>
        <!-- message -->
        <div id="designer-message"></div>
        <!-- workspace -->
        <div id="designer-workspace" class="placeholders"></div>
      </div>
      <!-- spaces -->
      <div id="designer-spaces" class="col-xs-3 col-sm-2">
        <div id="designer-spaces-spaces-system" class="sidebar-module sidebar-module-inset">
          <p id="designer-spaces-system-header" class="designer-spaces-header"></p>
          <ul id="designer-spaces-system-items" class="nav"></ul>
        </div>
        <div class="sidebar-module sidebar-module-inset">
          <p id="designer-spaces-type" class="designer-spaces-header"></p>
          <ul id="designer-spaces-items" class="nav"></ul>
        </div>
        <div id="designer-spaces-spaces-components" class="sidebar-module sidebar-module-inset">
          <p id="designer-spaces-components-header" class="designer-spaces-header"></p>
          <ul id="designer-spaces-components-items" class="nav"></ul>
        </div>
        <div class="sidebar-module sidebar-module-inset help">
          <p class="designer-spaces-header">Help</p>
          <p id="designer-spaces-help" class="designer-spaces-help-text"></p>
        </div>
      </div>
    </div>
  </div>
  <!-- lib -->
  <script>if (typeof module === "object") {window.module = module; module = undefined;}</script>
	<script src="lib/designer/vendor.js"></script>
  <script>if (window.module) module = window.module;</script>
  <!-- designer -->
  <script type="text/javascript" src="scripts/system-designer.js"></script>
</body>

</html>